<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head th:include="common/head :: head"></head>

<body class="gray-bg">
<form id="ec" th:action="@{/admin}" method="post">
  <div class="wrapper wrapper-content animated fadeInRight">

    <div class="row">
      <div class="col-sm-12">
        <div class="ibox float-e-margins">
          <div class="ibox-content">
            <table class="table form-table margin-bottom10">
              <tr>
                <td>
                  <input type="text" name="username" th:value="${#maps.containsKey(filters, 'username')} ? ${filters.username} : ''" placeholder="用户名" class="input-sm form-control"/>
                </td>
                <td>
                  <input type="text" name="name" th:value="${#maps.containsKey(filters, 'name')} ? ${filters.name} : ''" placeholder="用户姓名" class="input-sm form-control"/>
                </td>
                <td>
                  <input type="text" name="phone" th:value="${#maps.containsKey(filters, 'phone')} ? ${filters.phone} : ''" placeholder="手机号码" class="input-sm form-control"/>
                </td>
              </tr>
              <tr>
                <td>
                  <input type="text" name="createTimeBegin" th:value="${#maps.containsKey(filters, 'createTimeBegin')} ? ${filters.createTimeBegin} : ''" placeholder="开始日期：YYYY-MM-DD" class="input-sm form-control" onclick="laydate({istime: true, format: 'YYYY-MM-DD'})"/>
                </td>
                <td>
                  <input type="text" name="createTimeEnd" th:value="${#maps.containsKey(filters, 'createTimeEnd')} ? ${filters.createTimeEnd} : ''" placeholder="截止日期：YYYY-MM-DD" class="input-sm form-control" onclick="laydate({istime: true, format: 'YYYY-MM-DD'})"/>
                </td>
                <td>
                </td>
              </tr>
            </table>
            <div>
              <button type="button" class="btn btn-sm btn-primary" onclick="javascript:document.forms.ec.pageNum.value=1;document.forms.ec.submit();">搜索</button>
              <button type="button" class="btn btn-sm btn-primary create"> 新增</button>
              <button type="button" id="loading-example-btn" onclick="javascript:window.location.reload();" class="btn btn-white btn-sm">刷新</button>
            </div>
            <table class="table table-striped table-bordered table-hover dataTables-example">
              <thead>
              <tr>
                <th>序号</th>
                <th>头像</th>
                <th>用户姓名</th>
                <th>用户账号</th>
                <th>手机号</th>
                <th>创建时间</th>
                <th>操作 </th>
              </tr>
              </thead>
              <tbody>
              <tr class="gradeX" th:each="item,it: ${page.list}">
                <td class="text-center" th:text="${it.count}">11</td>
                <td>
                  <img th:src="${item.headUrl}" style="width: 60px; height: 60px;">
                </td>
                <td th:text="${item.name}">22</td>
                <td th:text="${item.username}">33</td>
                <td th:text="${item.phone}">22</td>
                <td th:text="${#dates.format(item.createTime,'yyyy-MM-dd HH:mm:ss')}" >33</td>
                <td class="text-center">
                  <a class="edit" th:attr="data-id=${item.id}">修改</a>
                  <a class="delete" th:attr="data-id=${item.id}">删除</a>
                  <a class="upload" th:attr="data-id=${item.id}">上传头像</a>
                  <a class="assign" th:attr="data-id=${item.id}" >分配角色</a>
                </td>
              </tr>
              </tbody>
            </table>

            <div class="row" th:include="common/pagination :: pagination"></div>
          </div>
        </div>
      </div>
    </div>
  </div>
</form>
</body>

<script th:inline="javascript">
  $(function(){
    $(".create").on("click",function () {
      var username = $("input[name='username']").val();
      if (username == "admin") {
        alert("不能创建名为admin的用户");
        return false;
      }
      opt.openWin('/admin/create','新增',630,430)
    });
    $(".edit").on("click",function () {
      var id = $(this).attr("data-id");
      opt.openWin('/admin/edit/' + id,'修改',580,430);
    });
    $(".delete").on("click",function(){
      var id = $(this).attr("data-id");
      opt.confirm('/admin/delete/'+id);
    });

    $(".upload").on("click",function(){
      var id = $(this).attr("data-id");
      opt.openWin('/admin/uploadShow/'+id,'上传头像',580,300);
    });

    $(".assign").on("click",function () {
      var id = $(this).attr("data-id");
      opt.openWin('/admin/assignShow/'+id,'分配角色',550,450)
    });
  });
</script>
</html>